<template lang="">
    <div class="loginRecord">
        <div class="userInfo">
            <span>登录记录</span>
            <p>若登录地址异常，请您及时修改密码</p>
            <div class="btn">
                <el-button @click="deleteAll()" type="danger"><i class="el-icon-delete"></i> 全部删除</el-button>
            </div>

            <div class="box">
                <el-table :data="loginData" stripe style="width: 100%">
                    <el-table-column prop="ip" label="IP" width="180">
                    </el-table-column>
                    <el-table-column prop="time" label="日期" width="180">
                    </el-table-column>
                    <el-table-column prop="ipAddress" label="地址">
                    </el-table-column>
                </el-table>
                <div style="margin: 20px 0;">
                    <el-pagination  background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page.sync="param.current" :page-sizes="[100, 200, 300, 400]" :page-size="param.size"
                    layout="prev, pager, next" :total="param.total">
                </el-pagination>
                </div>
            </div>

        </div>
    </div>
</template>
<script>
import { getLog,deleteLog } from "../../../utils/log.js";
    export default {
        data() {
            return {
                params: {
                    userId: "",
                    token: "",
                },
                param:{
                    current:1,
                    size:5,
                    total:0
                },
                loginData: []
            }
        },
        created() {
            this.params.userId = localStorage.getItem("user");
            this.params.token = this.$cookies.get("token");
            this.getLogin();
        },
        methods: {
            getLogin(){
                getLog(this.param,this.params).then(res=>{
                    if(res.data.code==200){
                        this.loginData = res.data.data.records;
                        this.param.current = res.data.data.current;
                        this.param.size = res.data.data.size;
                        this.param.total = res.data.data.total;
                    }else{
                        this.$message.error(res.data.msg);
                    }
                })
            },
            handleSizeChange(val) {
                this.param.size=val;
                this.getLogin();
            },
            handleCurrentChange(val) {
                this.param.current=val;
                this.getLogin();
            },
            deleteAll(){
                this.$confirm('确定要删除全部登录信息吗？')
                .then(_ => {
                    deleteLog(this.params).then(res=>{
                    if(res.data.code==200){
                        this.$message.success(res.data.msg);
                        this.getLogin();
                    }else{
                        this.$message.error(res.data.msg);
                    }
                })
                }) .catch(_ => {});
            }
        },
    }
</script>
<style lang="less" scoped>
    @import url('./index.less');
</style>